<template>
<div>
     <div id="main" style="width: 1200px;height:580px;"></div>
<!-- <div v-for="item in TopViewList" :key="item.id">
    {{item.title}}
</div> -->
</div>
</template>

<script>
import * as echarts from 'echarts'
// import _ from 'lodash'
export default {
  props: ['TopViewList'],
  data () {
    return {
      option2: {
        title: {
          text: 'Top10浏览文章',
          textStyle: {
            fontSize: 20, // 标题文字大小颜色
            color: '#ec2d7a'
          }
        },
        xAxis: {
          type: 'category', // 类目轴
          data: '', // 轴属性
          textStyle: {
            fontSize: 2, // 标题文字大小颜色
            color: '#432'
          },
          axisLabel: {
            interval: 0
          }
          //
        },
        yAxis: {
          type: 'value' // 数值轴
        },
        tooltip: {
          trigger: 'item'
        },
        series: [
          {
            name: '标题',
            type: 'bar', // 图标类型
            data: ''
          }
        ]
      }
    }
  },
  methods: {},
  created () {
  },
  components: {},
  mounted () {
    this.option2.xAxis.data = JSON.parse(window.localStorage.getItem('xAxisData'))
    this.option2.series[0].data = JSON.parse(window.localStorage.getItem('seriesData'))

    var mCharts = echarts.init(document.getElementById('main'), 'dark')
    mCharts.setOption(this.option2)
  },
  watch: {
  }

}
</script>

<style lang="less" scoped>

</style>
